<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>数据库自动备份应用平台-登录日志页面</title>
	<meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
	<link rel="stylesheet" th:href="@{/static/lib/layui/css/layui.css}">
	<link rel="stylesheet" th:href="@{/static/css/nicer.css}" media="all">
</head>
<body>
<div class="layui-row">
	<table id="login_log" lay-filter="login_log"></table>
</div>
<script th:src="@{/static/lib/layui/layui.js}"></script>
<script th:inline="javascript">
	const ctx = /*[[ @{/} ]]*/ "";

    layui.use('table', function () {
        const table = layui.table;

        //第一个实例
        table.render({
            elem: '#login_log'
            , url: ctx + 'log/list' //数据接口
            , page: true //开启分页
			, limit: 10
			, limits: [10, 15, 30, 50, 100, 200]
            , cols: [ [ //表头
                {type: 'numbers', title: 'ID', width: "10%", sort: true, align: "center"}
                , {field: 'username', title: '登录名', width: "20%", align: "center"}
                , {field: 'loginTime', title: '登录时间', width: "20%", sort: true, align: "center"}
                , {field: 'loginIp', title: '登录IP', width: "20%", align: "center"}
                , {field: 'browserInfo', title: '浏览器信息', width: "20%"}
                , {
                    field: 'loginState', title: '登录状态', width: "10%", align: "center", templet: function (d) {
                        if (d.loginState === 1) {
                            return "<span>成功  <i class='layui-icon layui-icon-ok-circle layui-bg-green'></i></span>";
                        } else if (d.loginState === 0) {
                            return "<span>失败  <i class='layui-icon layui-icon-close-fill layui-bg-red'></i></span>";
                        } else {
                            return "";
                        }
                    }
                }
            ] ]
        });
    });
</script>
</body>
</html>